﻿<Page
    x:Name="PageRoot"
    x:Class="MultimediaExample.MediaCapturePage"
    DataContext="{Binding ViewModel, RelativeSource={RelativeSource Self}}"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:multimediaExample="using:MultimediaExample"
    xmlns:common="using:MultimediaExample.Common"
    mc:Ignorable="d"
    d:DataContext="{d:DesignInstance Type=multimediaExample:DesignMediaCaptureViewModel, IsDesignTimeCreatable=True}">

    <Page.Resources>
        <x:String x:Key="PageName">Media Capture</x:String>
        <common:BooleanToVisibilityConverter TrueValue="Visible" x:Key="IfTrueThenVisible"/>
        <common:BooleanToVisibilityConverter TrueValue="Collapsed" x:Key="IfFalseThenVisible"/>
    </Page.Resources>

    <!--
        This grid acts as a root panel for the page that defines two rows:
        * Row 0 contains the back button and page title
        * Row 1 contains the rest of the page layout
    -->
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.ChildrenTransitions>
            <TransitionCollection>
                <EntranceThemeTransition/>
            </TransitionCollection>
        </Grid.ChildrenTransitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="140"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="1">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Grid.Resources>
                    <Style TargetType="Border" x:Key="BlockBorderStyle">
                        <Setter Property="BorderThickness" Value="{StaticResource FlyoutBorderThemeThickness}"/>
                        <Setter Property="BorderBrush" Value="{StaticResource FlyoutBorderThemeBrush}"/>
                        <Setter Property="Padding" Value="5"/>
                        <Setter Property="Margin" Value="5"/>
                    </Style>
                </Grid.Resources>
                <Border Grid.Column="0" MinWidth="320" Style="{StaticResource BlockBorderStyle}">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <Grid.Resources>
                            <Style TargetType="TextBlock" BasedOn="{StaticResource BaseTextBlockStyle}">
                                <Setter Property="Margin" Value="5"/>
                            </Style>
                            <Style TargetType="ComboBox">
                                <Setter Property="Margin" Value="5"/>
                            </Style>
                            <Style TargetType="Button">
                                <Setter Property="Margin" Value="5"/>
                            </Style>
                        </Grid.Resources>
                        <ComboBox Grid.Row="1" Header="Cameras:" ItemsSource="{Binding VideoCaptureDevices}" DisplayMemberPath="Name" SelectedItem="{Binding SelectedVideoCaptureDevice, Mode=TwoWay}"/>
                        <ComboBox Grid.Row="2" Header="Microphones:" ItemsSource="{Binding AudioCaptureDevices}" DisplayMemberPath="Name" SelectedItem="{Binding SelectedAudioCaptureDevice, Mode=TwoWay}"/>
                        <ComboBox Grid.Row="3" Header="Capture Quality:" ItemsSource="{Binding VideoQualities}" SelectedItem="{Binding SelectedVideoQuality, Mode=TwoWay}"/>
                        <TextBlock Grid.Row="4" Text="Mirror Preview:"/>
                        <CheckBox Grid.Row="5" IsChecked="{Binding IsPreviewMirrored, Mode=TwoWay}"/>

                        <Button Grid.Row="6" Content="Camera Settings" HorizontalAlignment="Stretch" Command="{Binding ShowCameraSettingsCommand}"/>
                        <Button Grid.Row="7" Content="Start Capture" HorizontalAlignment="Stretch" Command="{Binding StartCaptureCommand}" Visibility="{Binding IsCapturing, Converter={StaticResource IfFalseThenVisible}}"/>
                        <Button Grid.Row="7" Content="Stop Capture" HorizontalAlignment="Stretch" Command="{Binding StopCaptureCommand}" Visibility="{Binding IsCapturing, Converter={StaticResource IfTrueThenVisible}}"/>
                    </Grid>
                </Border>
                <Border Grid.Column="1" Style="{StaticResource BlockBorderStyle}">
                    <CaptureElement x:Name="CaptureElementItem" Grid.Row="0"/>
                </Border>
            </Grid>
        </Grid>

        <!-- Back button and page title -->
        <Grid Grid.Row="0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="120"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Button x:Name="BackButton" Margin="39,59,39,0" Command="{Binding NavigationHelper.GoBackCommand, ElementName=PageRoot}"
                        Style="{StaticResource NavigationBackButtonNormalStyle}"
                        VerticalAlignment="Top"
                        AutomationProperties.Name="Back"
                        AutomationProperties.AutomationId="BackButton"
                        AutomationProperties.ItemType="Navigation Button"/>
            <TextBlock x:Name="PageTitle" Text="{StaticResource PageName}" Style="{StaticResource HeaderTextBlockStyle}" Grid.Column="1" 
                        IsHitTestVisible="false" TextWrapping="NoWrap" VerticalAlignment="Bottom" Margin="0,0,30,40"/>
        </Grid>
    </Grid>
</Page>
